﻿<%@ Page Title="家乐福——活动花絮" Language="C#" MasterPageFile="~/MasterPageTwoCol.master"
    AutoEventWireup="true" CodeBehind="EventHighlight.aspx.cs" Inherits="WebSite.EventHighlight" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <style>
        div#act_area div.riqi_item
        {
            width: 95px;
            height: 40px;
            position: absolute;
            padding-top: 8px;
        }
        
        div#act_area div#act_area_content
        {
            height: 50px;
            width: 570px;
            margin: 0 auto;
            background: url(images/EventHighlight/riqi_area.png) no-repeat;
            color: #a68635;
            position: relative;
        }
        
        div#act_area div.riqi_item_selected
        {
            background: url(images/EventHighlight/riqi_selected.png) no-repeat;
        }
    </style>
    <style>
        div#divFlowerPhoto
        {
            vertical-align: top;
            width: 660px;
            margin: 20px auto 0px auto;
        }
        
        div#divFlowerPhoto div.Line
        {
            position: relative;
            height: 270px;
        }
        
        div#divFlowerPhoto div.Line div.Header
        {
            height: 75px;
            width: 100%;
            background: url(images/EventHighlight/flowerline2.png) no-repeat;
            position: absolute;
            z-index: 50;
        }
        div#divFlowerPhoto div.Line div.PhotoFrame
        {
            height: 200px;
            width: 200px;
            display: inline-block;
            background: url(../images/BabyGroup/userphotoframe.png) no-repeat;
            padding: 4px;
            position: absolute;
        }
        div.pf1
        {
            top: 52px;
            left: 20px;
        }
        div.pf2
        {
            top: 60px;
            left: 230px;
        }
        div.pf3
        {
            top: 53px;
            left: 440px;
        }
        
        div#divFlowerPhoto div.Line div.Photo
        {
            width: 200px;
            height: 200px; /*background: url(images/EventHighlight/DefaultPhoto.png) no-repeat;*/
            z-index: 50;
            position: relative;
        }
        .PhotoFrame img
        {
            width: 200px;
            height: 200px;
        }
        
        .r_3
        {
            height: 296px;
            position: relative;
            overflow: hidden;
        }
        
        .scroll_1_1
        {
            padding: 10px 30px;
            font-size: 14px;
        }
        .scroll_1_1 .orange
        {
            float: right;
        }
        .scroll_1_2
        {
            padding: 10px 20px;
            font-size: 14px;
        }
        .scroll_1_2 .scroll_1_2_1
        {
            width: 120px;
        }
        .scroll_1_2 .scroll_1_2_1 span
        {
            display: block;
            text-align: center;
        }
        .scroll_1_2 .scroll_1_2_2
        {
            font-size: 26px;
            float: right;
        }
        .scroll_1_3
        {
            padding: 10px 20px;
            font-size: 14px;
            text-align: center;
        }
    </style>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <%--<div style="height: 50px; background: url(images/EventHighlight/xianxiajinjibaobaobang.png) no-repeat">
    </div>--%>
    <%--<div class="r_3">
        <div class="scroll_c" >
            <ul id="icon-carousel_3" class="jcarousel-skin-tango">
                <li>
                    <div class="scroll_i">
                        <a href="#" hidefocus="true">
                            <img src="images/Frame/demo/slider_1.jpg" width="326" height="215" /></a>
                        <div class="scroll_1_2">
                            <div class="scroll_1_2_2">
                                <span class="orange">上海</span>
                            </div>
                            <div class="scroll_1_2_1">
                                <span class="orange">洋洋 / 豆豆</span> <span class=" green2">家乐福宝宝帮</span>
                            </div>
                        </div>
                    </div>
                </li>
                <li>
                    <div class="scroll_i">
                        <a href="#" hidefocus="true">
                            <img src="images/Frame/demo/slider_2.jpg" width="326" height="215" /></a>
                        <div class="scroll_1_2">
                            <div class="scroll_1_2_2">
                                <span class="orange">上海</span>
                            </div>
                            <div class="scroll_1_2_1">
                                <span class="orange">洋洋 / 豆豆</span> <span class=" green2">家乐福宝宝帮</span>
                            </div>
                        </div>
                    </div>
                </li>
                <li>
                    <div class="scroll_i">
                        <a href="#" hidefocus="true">
                            <img src="images/Frame/demo/slider_1.jpg" width="326" height="215" /></a>
                        <div class="scroll_1_2">
                            <div class="scroll_1_2_2">
                                <span class="orange">上海</span>
                            </div>
                            <div class="scroll_1_2_1">
                                <span class="orange">洋洋 / 豆豆</span> <span class=" green2">家乐福宝宝帮</span>
                            </div>
                        </div>
                    </div>
                </li>
                <li>
                    <div class="scroll_i">
                        <a href="#" hidefocus="true">
                            <img src="images/Frame/demo/slider_2.jpg" width="326" height="215" /></a>
                        <div class="scroll_1_2">
                            <div class="scroll_1_2_2">
                                <span class="orange">上海</span>
                            </div>
                            <div class="scroll_1_2_1">
                                <span class="orange">洋洋 / 豆豆</span> <span class=" green2">家乐福宝宝帮</span>
                            </div>
                        </div>
                    </div>
                </li>
            </ul>
        </div>
    </div>--%>
    <div style="overflow: hidden; display: none">
        <div style="width: 320px; float: left; margin-right: 10px;">
            <div style="height: 215px; overflow: hidden">
                <img src="images/EventHighlight/photo_list_pic1.png" alt="" />
            </div>
            <div style="float: left; width: 190px; text-align: center; padding: 18px;">
                <div style="color: #419310; font-size: 14px; font-family: Microsoft YaHei;">
                    家乐福宝宝帮</div>
                <div style="color: #ff6418; font-size: 14px; font-family: Microsoft YaHei;">
                    洋洋 / 豆豆</div>
            </div>
            <div style="float: right; text-align: center; padding: 18px;">
                <div style="color: #f96200; font-size: 26px; font-family: Microsoft YaHei;">
                    上海</div>
            </div>
            <div class="clearAll">
            </div>
        </div>
        <div style="width: 320px; float: left; margin-right: 10px;">
            <div>
                <img src="images/EventHighlight/photo_list_pic2.png" alt="" />
            </div>
            <div style="float: left; width: 190px; text-align: center; padding: 18px;">
                <div style="color: #419310; font-size: 14px; font-family: Microsoft YaHei;">
                    家乐福宝宝帮</div>
                <div style="color: #ff6418; font-size: 14px; font-family: Microsoft YaHei;">
                    洋洋 / 豆豆</div>
            </div>
            <div style="float: right; text-align: center; padding: 18px;">
                <div style="color: #f96200; font-size: 26px; font-family: Microsoft YaHei;">
                    上海</div>
            </div>
            <div class="clearAll">
            </div>
        </div>
        <div class="clearAll">
        </div>
    </div>
    <div style="height: 50px; background: url(images/EventHighlight/jingcaihuodonghuaxu.png) no-repeat">
        <div style="text-align: right">
            <script type="text/javascript">
                addweibosharebtn("家乐福“冠军宝贝在我家—2013#快乐宝宝帮#大赛”活动现场惊喜不断！想去现场参加活动的朋友看看时间安排吧>>> http://cover.carrefour.com.cn");
            </script>
        </div>
    </div>
    <div id="act_area" style="overflow: hidden; text-align: center">
        <div id="act_area_content">
            <div class="riqi_item <%= Request["citytype"] == null || Request["citytype"] == "0" ? "riqi_item_selected" : "" %>"
                style="left: 0px;">
                <a href="/EventHighlight.aspx?citytype=0">
                    <p>
                        上海</p>
                    <p>
                        10.3-4</p>
                </a>
            </div>
            <div class="riqi_item <%= Request["citytype"] == "1" ? "riqi_item_selected" : "" %>"
                style="left: 95px;">
                <a href="/EventHighlight.aspx?citytype=1">
                    <p>
                        沈阳</p>
                    <p>
                        10.6-7</p>
                </a>
            </div>
            <div class="riqi_item <%= Request["citytype"] == "2" ? "riqi_item_selected" : "" %>"
                style="left: 190px;">
                <a href="/EventHighlight.aspx?citytype=2">
                    <p>
                        北京</p>
                    <p>
                        10.13-14</p>
                </a>
            </div>
            <div class="riqi_item <%= Request["citytype"] == "3" ? "riqi_item_selected" : "" %>"
                style="left: 285px;">
                <a href="/EventHighlight.aspx?citytype=3">
                    <p>
                        深圳</p>
                    <p>
                        10.13-14</p>
                </a>
            </div>
            <div class="riqi_item <%= Request["citytype"] == "4" ? "riqi_item_selected" : "" %>"
                style="left: 380px;">
                <a href="/EventHighlight.aspx?citytype=4">
                    <p>
                        宁波</p>
                    <p>
                        10.20-21</p>
                </a>
            </div>
            <div class="riqi_item <%= Request["citytype"] == "5" ? "riqi_item_selected" : "" %>"
                style="left: 475px;">
                <a href="/EventHighlight.aspx?citytype=5">
                    <p>
                        成都</p>
                    <p>
                        10.20-21</p>
                </a>
            </div>
        </div>
    </div>
    <% if (listHighlight.Count == 0)
       { %>
    <!-- 没数据时 -->
    <div style="width: 100px; margin: 50px auto">
        敬请期待</div>
    <%}
       else
       { %>
    <!-- 有数据时 -->
    <div id="divFlowerPhoto">
        <% 
           int linecount = (listHighlight.Count % 3) == 0 ? listHighlight.Count / 3 : listHighlight.Count / 3 + 1;
           for (int curline = 0; curline < linecount; curline++)
           {
               var p1 = listHighlight[curline * 3];
               var p2 = listHighlight.Count > curline * 3 + 1 ? listHighlight[curline * 3 + 1] : null;
               var p3 = listHighlight.Count > curline * 3 + 2 ? listHighlight[curline * 3 + 2] : null;
        %>
        <div class="Line">
            <div class="Header" style="top: 0px; left: 0px;">
            </div>
            <div class="PhotoFrame pf1">
                <div class="Photo">
                    <a title="<%=GetTitle(p1) %>" class="<%= GetCssClass(p1) %>" href="<%= GetImage(p1) %>">
                        <img class="photo_huaxu" src="<%= GetImage(p1) %>" />
                    </a>
                </div>
            </div>
            <div class="PhotoFrame pf2">
                <div class="Photo">
                    <a title="<%=GetTitle(p2) %>" class="<%= GetCssClass(p2) %>" href="<%= GetImage(p2) %>">
                        <img class="photo_huaxu" src="<%= GetImage(p2) %>" />
                    </a>
                </div>
            </div>
            <div class="PhotoFrame pf3">
                <div class="Photo">
                    <a title="<%=GetTitle(p3) %>" class="<%= GetCssClass(p3) %>" href="<%= GetImage(p3) %>">
                        <img class="photo_huaxu" src="<%= GetImage(p3) %>" />
                    </a>
                </div>
            </div>
        </div>
        
        <% } %>
    </div>
    <%} %>
    <%--<script type="text/javascript">
        $(document).ready(function ()
        {
            jQuery('#icon-carousel_3').jcarousel({
                scroll: 1,
                start: 1,
                wrap: 'circular'
            });
            
            $.waypoints.settings.scrollThrottle = 30;
            $('#framebody').waypoint(function (event, direction)
            {
                $('.top').toggleClass('hidden', direction === "up");
            }, {
                offset: '-10'
            });
            //$('.top').addClass('hidden');
            $('.top').click(function ()
            {
                $('body,html').animate({ scrollTop: 0 }, 'slow');
                return false;
            });
        });
    </script>--%>
    <script>
        $(document).ready(function ()
        {
            $(".a_huaxu").colorbox({ rel: "a_huaxu", transition: "fade", close: "关闭", previous: "上一张", next: "下一张", current: "&nbsp;&nbsp;&nbsp;{current}/{total}", overlayClose: true });

        });
    </script>
</asp:Content>
